import { Tabs } from "expo-router";

import Ionicons from "@expo/vector-icons/Ionicons";

export default function TabLayout() {
  return (
    <Tabs
      screenOptions={{
        tabBarActiveTintColor: "#0079FE",
        headerStyle: {
          backgroundColor: "#FFFFFF",
        },
        headerTitleAlign: "center",
        headerShadowVisible: false,
        headerTintColor: "#000",
        tabBarStyle: {
          backgroundColor: "#FFFFFF",
        },
      }}
    >
      <Tabs.Screen
        name="index"
        options={{
          title: "首页",
          tabBarIcon: ({ color, focused }) => (
            <Ionicons
              name={focused ? "home-sharp" : "home-outline"} // 正确的 Ionicons 图标
              color={color}
              size={24}
            />
          ),
        }}
      />
      <Tabs.Screen
        name="Find"
        options={{
          title: "发现",
          tabBarIcon: ({ color, focused }) => (
            <Ionicons
              name={focused ? "compass-sharp" : "compass-outline"} // 使用正确的名称
              color={color}
              size={24}
            />
          ),
        }}
      />
      <Tabs.Screen
        name="User"
        options={{
          title: "我的",
          tabBarIcon: ({ color, focused }) => (
            <Ionicons
              name={focused ? "person-sharp" : "person-outline"} // 使用正确的名称
              color={color}
              size={24}
            />
          ),
        }}
      />
    </Tabs>
  );
}
